<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width" />
    <meta name="author" content="z" />
    <title>留言板</title>
    <link rel="stylesheet" th:href="@{/font-awesome/css/font-awesome.min.css}">
    <link rel="stylesheet" th:href="@{/layui/css/layui.css}" />
    <link rel="stylesheet" th:href="@{/pear/css/pear.css}" />
    <link th:href="@{/css/index_style.css}" rel="stylesheet" type="text/css">
    <link rel="stylesheet" th:href="@{/css/master.css}" />
    <link rel="stylesheet" th:href="@{/css/gloable.css}" />
    <link rel="stylesheet" th:href="@{/css/nprogress.css}" />
    <link rel="stylesheet" th:href="@{/css/message.css}" />
</head>
<body>
    <div class="header">
    </div>
    <header th:replace="common :: header"/>

    <div class="doc-container layui-card">
        <div class="layui-card-body">
            <form class="layui-form layui-form-pane">
                <div class="layui-form-item">
                    <label class="layui-form-label">标题</label>
                    <div class="layui-input-inline">
                        <input type="text" name="title" id="title" placeholder="" class="layui-input">
                    </div>
                    <label class="layui-form-label">内容</label>
                    <div class="layui-input-inline">
                        <input type="text" name="remark" id="remark" placeholder="" class="layui-input">
                    </div>
                    <div class="layui-inline">
                        <button type="submit" class="layui-btn layui-btn-primary" lay-submit lay-filter="data-search-btn"><i class="layui-icon">&#xe615;</i>
                            搜 索
                        </button>
                    </div>
                </div>
            </form>
            <div id="currentTableId"></div>
        </div>
    </div>
    <div class="f-cb"></div>
    <div id="doc-container">
        <div class="container-fixed" style="width: auto">
            <div class="container-inner">
                <section class="msg-remark">
                    <h1>留言板</h1>
                    <p>
                        沟通交流，拉近你我！
                    </p>
                </section>
                <div class="textarea-wrap message" id="textarea-wrap">
                    <form class="layui-form">
                        <div>
                            <div class="main-container">
                                <div class="layui-form-item">
                                    <div class="layui-upload">
                                        <input type="hidden" name="image" required lay-verify="required" />
                                        <button type="button" class="layui-btn" id="test1">上传图片</button>
                                        <div class="layui-upload-list" >
                                            <img class="layui-upload-img" id="demo1" style=" width: 330px;height: 230px;">
                                            <p id="demoText"></p>
                                        </div>
                                    </div>
                                </div>
                                <div class="layui-form-item">
                                    <div class="">
                                        <input type="text" name="title" placeholder="标题"
                                               class="layui-input" />
                                    </div>
                                </div>
                                <div class="layui-form-item">
                                    <div class="">
                                        <input type="text" name="remark" placeholder="内容"
                                               class="layui-input" />
                                    </div>
                                </div>
                                <div class="layui-form-item">
                                    <div class="">
                                        <input type="text" name="email" placeholder="邮箱"
                                               class="layui-input" />
                                    </div>
                                </div>
                                <div class="layui-form-item">
                                    <div class="">
                                        <input type="text" name="nickname" placeholder="昵称"
                                               class="layui-input" />
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="bottom" style="bottom: auto;">
                            <div class="button-container">
                                <button type="submit" class="pear-btn pear-btn-primary pear-btn-sm" lay-submit="" lay-filter="message-save">
                                    <i class="layui-icon layui-icon-ok"></i>
                                    提交
                                </button>
                                <button id="cz" type="reset" class="pear-btn pear-btn-sm">
                                    <i class="layui-icon layui-icon-refresh"></i>
                                    重置
                                </button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>

        </div>
    </div>

    <footer th:replace="common :: footer"/>
    <script th:src="@{/layui/layui.js}"></script>
    <script th:src="@{/pear/pear.js}"></script>
    <script th:src="@{/js/yss/gloable.js}"></script>
    <script th:src="@{/js/plugins/nprogress.js}"></script>
    <script>NProgress.start();</script>
    <script th:src="@{/js/pagemessage.js}"></script>

   <!-- <div class="container">
        <div class="demo">
            <div class="snowwrap">
                <div class="snow-container"></div>
            </div>

            <style type='text/css'>
                .snowwrap,.snow-container{position: fixed; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; z-index: 100001;}
            </style>
            <script th:src="@{/js/jquery.min.js}"></script>
            <script th:src="@{/js/plugins/snow.js}"></script>
        </div>
    </div>-->


    <script>
        layui.use(['table', 'layer', 'form', 'jquery', 'card'], function() {

            let table = layui.table;
            let form = layui.form;
            let $ = layui.jquery;
            let layer = layui.layer;
            let card = layui.card;

            $('.search').hide();
            card.render({
                elem: '#currentTableId',
                url: 'message/data', // 接口数据
                data: [], // 静态数据
                page: true, // 是否分页
                limit: 8, // 每页数量
                linenum: 4, // 每行数量
                clickItem: function(data){ // 单击事件
                    console.log(data)
                }
            })

            // 监听搜索操作
            form.on('submit(data-search-btn)', function(data) {
                queryJson = data.field;
                card.reload("currentTableId", {
                    where: queryJson,
                });
                return false;
            });
           /* form.on('submit(data-checked-btn)', function() {
                var data = card.getChecked("currentTableId");
                layer.msg(JSON.stringify(data));
                return false;
            });
            form.on('submit(data-btn)', function() {
                var data = card.getAllData("currentTableId");
                layer.msg(JSON.stringify(data));
                return false;
            });*/
        })
    </script>

    <script> 
        window.onload = function () {
            NProgress.done();
        };
    </script>
</body>
</html>
